<template>
	<u-tabbar :value="active" @change="change" activeColor="#000" inactiveColor="#999">
		<u-tabbar-item :text="item.text" :icon="active == index ? item.selectedIconPath : item.iconPath"
			v-for="(item, index) in list" :key="index"></u-tabbar-item>
	</u-tabbar>
</template>

<script>
	export default {
		name: "layout",
		props: ['active'],
		data() {
			return {
				list: [{
						text: "活动",
						pagePath: "/pages/tabbar/index",
						iconPath: "/static/image/tabbar_index.png",
						selectedIconPath: "/static/image/tabbar_index_on.png",
					},
					{
						text: "主理",
						pagePath: "/pages/tabbar/lead",
						iconPath: "/static/image/tabbar_lead.png",
						selectedIconPath: "/static/image/tabbar_lead_on.png",
					},
					{
						text: "我的",
						pagePath: "/pages/tabbar/my",
						iconPath: "/static/image/tabbar_my.png",
						selectedIconPath: "/static/image/tabbar_my_on.png",
					},
				],
			};
		},
		methods: {
			change(i) {
				// console.log();
				// return
				this.jump(this.list[i].pagePath)
			},
		},
	};
</script>

<style lang="scss">
	::v-deep .u-tabbar-item__text {
		font-size: 20rpx !important;
	}
</style>